<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://http://www.thymeleaf.org">
<head>
    <title>文件列表</title>
    <meta charset="UTF-8"/>

    <script src="../../../js/jquery-2.0.3.min.js"></script>
    <link rel="stylesheet" href="../../../css/bootstrap.min.css">
    <script src="../../../js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="../../../css/bootstrapValidator.css">
    <script src="../../../js/bootstrapValidator.js"></script>
    <script src="../../../js/jquery.cookie.js"></script>
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script src="../../../js/hostConfig.js"></script>

</head>
<body>
<div class="container">
    <br>

    <div class="col-lg-1 "><a href="/#" class="btn btn-default">返回首页</a></div>
    <div class="col-lg-1"><a href="/pages/manage/permission/add.html" class="btn btn-default">增加权限</a></div>
    <table class="table table-hover">
        <caption>权限列表</caption>
        <thead>
        <tr>
            <th>ID</th>
            <th>名称</th>
            <th>描述</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody id="app">
        <tr v-for="p in todos">
            <td v-text="p.id">1</td>
            <td v-text="p.name">2</td>
            <td v-text="p.description">3</td>
            <td><a href="javascript:;" @click="submitDelete(p.id)">删除</a>
                <a :href="'/pages/manage/permission/update.html?id='+p.id">修改</a>
            </td>
        </tr>
        </tbody>
    </table>

</div>
</body>
</html>

<script>
    var path = host_tomcatR;
    var app = new Vue({
        el: '#app',
        data: {
            todos: []
        },
        mounted() {
            axios({method: 'post', url: path + '/p/list', withCredentials: true}).then(res => this.todos = res.data);
        },
        methods: {
            submitDelete: function (id) {
                axios({
                    method: 'post',
                    url: path + '/p/delete?id=' + id,
                    withCredentials: true
                }).then(res => this.todos = res.data).then(res => {
                    window.location.href = "/pages/manage/permission/list.html";
                });
            }
        }
    });
</script>
